<template>
  <div class="all">
    <van-nav-bar
      fixed
      placeholder
      safe-area-inset-top
      title="抢任务赚佣金"
      @click-left="back"
    >
      <template #left>
        <van-icon name="arrow-left" size="16px" color="#333" />
      </template>
    </van-nav-bar>
    <div class="map">
      <div id="normal_map">
        <!-- <el-amap vid="amapDemo" :center="center" :zoom="10" class="amap-demo" /> -->
      </div>
      <div class="shownum showbox1">
        房源录入{{ grabdata.mapData.houseInputCount }}个
      </div>
      <div class="shownum showbox2">
        带看服务{{ grabdata.mapData.takeServiceCount }}个
      </div>
      <div class="shownum showbox3">
        交易服务{{ grabdata.mapData.transactionServiceCount }}个
      </div>
      <div class="shownum showbox4">
        金融服务{{ grabdata.mapData.financialServiceCount }}个
      </div>
      <div class="shownum showbox5">
        交割服务{{ grabdata.mapData.deliveryServiceCount }}个
      </div>
      <div class="shownum showbox6">
        咨询服务{{ grabdata.mapData.consultCount }}个
      </div>
      <div class="shownum showbox7">定制服务(售){{ grabdata.want_buy_num }}个</div>
      <div class="shownum showbox8">
        团购服务{{ grabdata.new_house_join_num }}个
      </div>
      <div class="shownum showbox9">
        定制服务(租){{ grabdata.want_rent_num }}个
      </div>
    </div>
    <div class="showpart">
      <div class="card">
        <div class="box1">二手房<span>每天抢任务，每天有钱赚</span></div>
        <div class="box2">
          <div>今日已发布服务订单（{{ city.slice(0, 3) }}）</div>
          <span>{{ grabdata.secondHandHouseReleased }}个</span>
        </div>
        <div class="box2">
          <div>待抢(分配)服务订单（{{ city.slice(0, 3) }}）</div>
          <span>{{ grabdata.secondHandHouseAcquire }}个</span>
        </div>
        <div class="box2">
          <div>今日所有服务佣金规模预估</div>
          <span>{{ grabdata.commissionScale }}元</span>
        </div>
      </div>
      <div class="card">
        <div class="box1">其他<span>获得更多赚钱机会</span></div>
        <div class="box2">
          <div>今日已发布购房需求定制服务单（{{ city.slice(0, 3) }}）</div>
          <span>{{ grabdata.want_buy_num }}个</span>
        </div>
        <div class="box2">
          <div>今日已发布租房需求定制服务单（{{ city.slice(0, 3) }}）</div>
          <span>{{ grabdata.want_rent_num }}个</span>
        </div>
        <div class="box2">
          <div>今日已发布新房团购服务单（{{ city.slice(0, 3) }}）</div>
          <span>{{ grabdata.new_house_join_num }}个</span>
        </div>
      </div>
      <div class="card">
        <div class="box2" @click="showarea = true">
          <div>您的服务区域</div>
          <div>{{ area }}<van-icon name="arrow" /></div>
        </div>
        <div class="box2" @click="showtime1 = true">
          <div>可服务的时间</div>
          <div>
            {{ seeApartmentTimeMin }}-{{ seeApartmentTimeMax
            }}<van-icon name="arrow" />
          </div>
        </div>
      </div>
      <div class="tipwords">
        <div>*在服务时间不冲突的前提下经纪人每天可抢得多个任务</div>
        <div>
          *房源录入 / 新房咨询 / 新房带看服务将由平台根据经纪人服务星级分配
        </div>
      </div>
    </div>
    <div class="btnpart">
      <button @click="graborder">立即抢单</button>
      <div class="safe" />
    </div>
    <van-overlay :show="show1">
      <div class="wrapper">
        <div class="red">
          <img src="../../assets/get.gif" alt="" />
          <div class="word">
            <div style="margin-bottom: 10px">还可以抢随机掉落红包</div>
            <div style="text-align: center">{{ time3 }}秒后自动关闭</div>
          </div>
          <div class="closebtn">
            <van-icon name="close" size="25px" @click="closeImg" />
          </div>
        </div>
      </div>
    </van-overlay>
    <van-overlay :show="showgrabing">
      <div class="wrapper">
        <div class="spart">
          <div class="close">
            <van-icon
              size="20px"
              color="#333"
              name="cross"
              @click="showgrabing = false"
            />
          </div>
          <div class="words">
            <span>努力抢单中,请稍后</span><span class="anmition">...</span>
          </div>
        </div>
      </div>
    </van-overlay>
    <van-overlay :show="showunget">
      <div class="wrapper">
        <div class="spart">
          <div class="close">
            <van-icon
              size="20px"
              color="#333"
              name="cross"
              @click="showunget = false"
            />
          </div>
          <div class="words2">未抢到合适的服务订单</div>
          <div class="words2 words3">继续加油!</div>
        </div>
      </div>
    </van-overlay>
    <van-overlay :show="showget">
      <div class="wrapper">
        <div class="spart">
          <div class="close">
            <van-icon
              size="20px"
              color="#333"
              name="cross"
              @click="showget = false"
            />
          </div>
          <div class="words4">恭喜！抢到一个服务订单！</div>
          <div class="bpart">
            <button @click="todetail">查看详情</button>
          </div>
        </div>
      </div>
    </van-overlay>
    <van-overlay :show="showgetmoney">
      <div class="wrapper">
        <div class="spart">
          <div class="close">
            <van-icon
              size="20px"
              color="#333"
              name="cross"
              @click="showgetmoney = false"
            />
          </div>
          <div class="words4">恭喜！获得随机红包1个！</div>
          <div class="bpart">
            <button @click="getredenvelopes">查看详情</button>
          </div>
        </div>
      </div>
    </van-overlay>
    <van-overlay :show="showred">
      <div class="wrapper">
        <div class="red">
          <img src="../../assets/get.gif" alt="" />
          <div class="word">{{ time }}秒后自动打开</div>
          <div class="closebtn">
            <van-icon name="close" size="25px" @click="closered" />
          </div>
        </div>
      </div>
    </van-overlay>
    <van-overlay :show="showreddetail">
      <div class="wrapper">
        <div class="reddetail">
          <div class="box1">
            <div class="word1">恭喜你获得现金</div>
            <div class="word2">
              <span>{{ money }}</span
              >元
            </div>
            <div v-show="money != '0'" class="word3">
              <button @click="toMe">点击查看</button>
            </div>
            <div v-show="money == '0'" class="word3">
              <button @click="closedetail">继续抢单</button>
            </div>
            <!-- <div v-show="money != '0'" class="word4">
              以存入个人中心-钱包,可提现使用,<span @click="tomoney"
                >点击查看</span
              >
            </div> -->
            <!-- <div v-show="show2" class="word4">
              已存入个人中心-钱包,可提现使用,<span @click="tomoney"
                >点击查看</span
              >
            </div> -->
            <div v-show="money == '0' && getnum == '0'" class="word4">
              哈哈哈.这个红包被小怪兽吃掉啦
            </div>
            <div v-show="money == '0' && getnum == '1'" class="word4">
              啊哦~红包被运营同学吞下去了
            </div>
            <div v-show="money == '0' && getnum == '2'" class="word4">
              皇上！红包变成蝴蝶飞走啦！
            </div>
            <div v-show="money == '0' && getnum == '3'" class="word4">
              你的红包被小狗叼走了
            </div>
            <div v-show="money == '0' && getnum == '4'" class="word4">
              呜呜，红包数字离家出走了
            </div>
            <div v-show="money == '0' && getnum == '5'" class="word4">
              别灰心，下次一定能抽到哒
            </div>
            <div class="word4">抢单过程中会随机掉落红包,最高金额200元</div>
            <div class="closebtn">
              <van-icon name="close" size="30px" @click="closedetail" />
            </div>
          </div>
        </div>
      </div>
    </van-overlay>
    <van-popup v-model="showarea" position="bottom" :style="{ height: '40%' }">
      <van-picker
        show-toolbar
        title="请选择服务区域"
        :columns="columns"
        visible-item-count="4"
        @confirm="onConfirm"
        @cancel="onCancel"
      />
    </van-popup>
    <van-popup
      v-model="showtime1"
      position="bottom"
      :style="{ height: '40%' }"
      @close="onclosetime1"
    >
      <van-datetime-picker
        v-model="seeApartmentTimeMin"
        type="time"
        title="选择起始时间"
        :min-hour="0"
        :max-hour="23"
        visible-item-count="4"
        @cancel="onclosetime1"
        @confirm="choosetime1"
      />
    </van-popup>
    <van-popup
      v-model="showtime2"
      position="bottom"
      :style="{ height: '40%' }"
      @close="onclosetime2"
    >
      <van-datetime-picker
        v-model="seeApartmentTimeMax"
        type="time"
        title="选择结束时间"
        :min-hour="TimeMin"
        :max-hour="23"
        visible-item-count="4"
        @cancel="onclosetime2"
        @confirm="choosetime2"
      />
    </van-popup>
  </div>
</template>

<script>
import { agentGrab } from "@/apis/buy.js";
import { getGrabinfo, getRedPacket } from "@/apis/user";
import { getTianPosition } from "@/apis/map.js";
import local from "@/utils/local";
import { _local } from "@/utils/storage";
import { mapGetters } from "vuex";
import { getUserId, getPosition } from "@/utils/auth";
import { baseUtils } from "@/utils/baseUtils";
import { shareIntegral } from "@/apis/integral";
import { getCityCode, getAreaList, getLnt } from "@/apis/city";
import { getTianAdministrative } from "@/apis/map";

export default {
  data() {
    return {
      agentCity: "",
      time3: 3,
      show: true,
      show1: false,
      show2: false,
      city: "",
      grabdata: {
        mapData: {
          houseInputCount: 0,
          deliveryServiceCount: 0,
          transactionServiceCount: 0,
          financialServiceCount: 0,
          takeServiceCount: 0,
          consultCount: 0,
        },
        commissionScale: 0,
        secondHandHouseAcquire: 0,
        secondHandHouseReleased: 0,
        newHouseTakeServiceCount: 0,
        newHouseConsultServiceCount: 0,
      },
      showgrabing: false,
      showunget: false,
      showget: false,
      showgetmoney: false,
      showred: false,
      showreddetail: false,
      showarea: false,
      showtime1: false,
      showtime2: false,
      seeApartmentTimeMin: "09:00",
      seeApartmentTimeMax: "18:00",
      TimeMin: 0,
      columns: [],
      arealist: [],
      center: [],
      area: "请选择",
      trustId: "",
      citycode: "",
      cangrab: false,
      timer: "",
      timer2: "",
      timer3: "",
      time: "3",
      money: "0",
      getnum: "0",
    };
  },
  computed: {
    ...mapGetters(["agent", "role"]),
  },
  created() {
    const _this = this;
    _this.$plusReady(() => {
      plus.share.getServices(function (e) {
        _this.shareData = e;
        for (var i in e) {
          if (e[i].id == "weixin") {
            _this.sharewx = e[i];
          }
        }
      });
    });
    _this.city = _local.get("city") ? _local.get("city"):"";
    // let lng = _local.get("lng");
    // let lat = _local.get("lat");
    // _this.center = [lng, lat];
    _this.getCity();
    _this.getdis();
    _this.getnum = Math.floor(Math.random() * 6);
  },
  mounted() {
    console.log("agent", _local.get("agent"));
    this.getCityRegion();
    this.timer = setInterval(() => {
      this.getgrab();
    }, 300);
  },
  beforeDestroy() {
    clearInterval(this.timer);
    clearInterval(this.timer2);
    clearInterval(this.timer3);
  },
  beforeUpdate() {
    if (
      this.grabdata.secondHandHouseAcquire >
      this.grabdata.secondHandHouseReleased
    ) {
      this.grabdata.secondHandHouseAcquire =
        this.grabdata.secondHandHouseReleased;
    }
  },
  methods: {
    //定位成功获取位置
    // getPos(){
    //  const pos=getPosition()
    //   // console.log(pos)
    //   if(pos){
    //     this.center=pos.position
    //   }
    // },
    getCityRegion() {
      getAreaList({
        citycode: _local.get("cityCode"),
      }).then((res) => {
        console.log("getAreaList", res);
        if (
          _local.get("city") == "北京市" ||
          _local.get("city") == "上海市" ||
          _local.get("city") == "天津市" ||
          _local.get("city") == "重庆市"
        ) {
          res.result.list.slice(1).forEach((e) => {
            this.columns.push(e.name);
          });
        } else {
          res.result.list.slice(2).forEach((e) => {
            this.columns.push(e.name);
          });
        }
      });
    },
    toMe() {
      this.$router.push("/home/me");
    },
    getCity() {
      const _this = this;
      if (_local.get("agent")) {
        getCityCode({
          citycode: _local.get("agent").citycode,
        }).then((res) => {
          _this.agentCity = res.result.list[0].name;
        });
      }
    },
    shareGetIntegral() {
      const _this = this;
      shareIntegral({ type: 5 }).then((res) => {
        if (res.code === 200) {
          _this.$toast("分享成功，获得1积分");
        }
      });
    },
    onSelect() {
      const _this = this;
      const msg = {
        type: "web",
        title: "兄弟，我在这里可以抢单抢红包！",
        content: "经纪人赚钱神器！全平台自由协作不分佣不扣佣，赚钱多结算快！",
        thumbs: ["https://image.nunbdc.net/image/152-152.png"],
        href: "https://html.nunbdc.net/agent6.html",
        extra: { scene: "WXSceneSession" },
      };
      _this.sharewx.send(
        msg,
        function () {
          if (_local.get("role") == 1 || _local.get("role") == 4) {
            _this.shareGetIntegral();
          }
          _this.$toast.success("分享成功");
        },
        function () {
          _this.$toast("分享失败");
        }
      );
    },
    closeImg() {
      this.show1 = false;
    },
    back() {
      this.$router.go(-1);
    },
    toagreement() {
      this.$router.push({ path: "/agentagreement" });
    },
    getgrab() {
      getGrabinfo({ cityCode: _local.get("cityCode") }).then((res) => {
        // console.log("getGrabinfo",res.result);
        if (res.code === 201) {
          this.grabdata = res.result;
        }
      });
    },
    getdis() {
      getLnt({
        keyword: _local.get("city"),
      }).then((res) => {
        console.log("lnglat", res);
        var lng = res.result.lon;
        var lat = res.result.lat;
        //初始化地图对象
        var map = new T.Map("normal_map");
        var lnglat = new T.LngLat(lng, lat);
        map.centerAndZoom(lnglat, 8);
        map.enableDrag();
      });
    },
    graborder() {
      // console.log("经纪人",this.agent)
      const userId = getUserId();
      if (userId) {
        this.$store.dispatch("manage/getInfo", { userId: userId });
        if (
          (_local.get("user").result.is_agent == 0 &&
            _local.get("user").result.agentReview.checkStatus == 0) ||
          _local.get("user").result.agentReview.checkStatus == 3
        ) {
          this.$router.push({ path: "/buyagent" });
        } else if (
          _local.get("user").result.is_agent == 0 &&
          _local.get("user").result.agentReview.checkStatus == 1
        ) {
          this.$dialog
            .alert({
              title: "温馨提示",
              message: "您提交的经纪人申请正在审核中，请等待审核结果",
              confirmButtonColor: "#45b7cb",
              theme: "round-button",
              messageAlign: "left",
            })
            .then(() => {
              this.$router.push({ path: "/home/me" });
            });
        } else if (
          _local.get("user").result.is_agent == 1 &&
          _local.get("role") != 4
        ) {
          this.$dialog
            .confirm({
              title: "温馨提示",
              className: "leftpart",
              confirmButtonText: "立即切换",
              confirmButtonColor: "#45b7cb",
              cancelButtonText: "取消",
              message: "您当前身份无法抢单，请切换到经纪人身份",
              messageAlign: "left",
            })
            .then(() => {
              this.$router.push({ path: "/rolechoose" });
            })
            .catch(() => {});
        }
        if (_local.get("agent").vip == 2 && _local.get("role") == 4) {
          if (
            this.agentCity == _local.get("city") ||
            _local.get("agent").citycode == "999999"
          ) {
            if (_local.get("show1")) {
              this.show1 = false;
            } else {
              this.show1 = true;
            }
            this.timer3 = setInterval(() => {
              this.time3--;
              if (this.time3 == 1) {
                this.show1 = false;
              }
              if (this.time3 == 0) {
                clearInterval(this.timer3);
                this.time3 = 3;
              }
            }, 1000);
            if (this.show1) {
              setTimeout(() => {
                this.showgrabing = true;
                agentGrab({
                  cityCode: _local.get("agent").citycode,
                }).then((res) => {
                  console.log("agentGrab", res);
                  var day = baseUtils.formatDate2(res.result.time);
                  var today = baseUtils.formatDate2(new Date());
                  if (day == today) {
                    _local.set("show1", 1);
                  } else {
                    _local.set("show1", 0);
                  }
                  if (res.code == 201) {
                    if (res.result.msg == "抢单失败") {
                      setTimeout(() => {
                        this.showgrabing = false;
                        this.showunget = true;
                      }, 2000);
                    } else if (res.result.msg == "抢到红包") {
                      getRedPacket().then((res) => {
                        console.log("getRedPacket", res);
                        this.money = res.result.money;
                      });
                      setTimeout(() => {
                        this.showgetmoney = true;
                        this.showgrabing = false;
                      }, 2000);
                    } else {
                      this.trustId = res.result.trustId;
                      setTimeout(() => {
                        this.showgrabing = false;
                        this.showget = true;
                      }, 2000);
                    }
                  }
                  if (res.code == 2088) {
                    _local.set("show1", 1);
                    setTimeout(() => {
                      this.showgrabing = false;
                      this.showunget = false;
                      this.$dialog
                        .confirm({
                          title: "温馨提示",
                          className: "leftpart",
                          confirmButtonText: "分享获积分",
                          confirmButtonColor: "#45b7cb",
                          cancelButtonText: "明日再来",
                          message:
                            "会员专属30次/日抢单次数已使用完毕，且无足够积分兑换，您可以通过分享获得更多赚钱机会",
                          messageAlign: "left",
                        })
                        .then(() => {
                          // this.$router.push({ path: "/buyjoin" });
                          this.onSelect();
                          _local.remove("show1");
                        })
                        .catch(() => {
                          this.showgrabing = false;
                          this.$router.push("/home/me");
                          _local.remove("show1");
                        });
                    }, 2000);
                  } else if (res.code == 2076) {
                    this.showgrabing = false;
                    this.$dialog
                      .alert({
                        title: "温馨提示",
                        message: "该地区暂无订单，如有疑问，请咨询客服",
                        confirmButtonColor: "#45b7cb",
                        theme: "round-button",
                        messageAlign: "left",
                      })
                      .then(() => {});
                  }else{
                    this.$toast(res.msg)
                  }
                });
              }, 3000);
            } else {
              this.showgrabing = true;
              agentGrab({
                cityCode: _local.get("agent").citycode,
              }).then((res) => {
                console.log("agentGrab", res);
                var day = baseUtils.formatDate2(res.result.time);
                var today = baseUtils.formatDate2(new Date());
                if (day == today) {
                  _local.set("show1", 1);
                } else {
                  _local.set("show1", 0);
                }
                if (res.code == 201) {
                  if (res.result.msg == "抢单失败") {
                    setTimeout(() => {
                      this.showgrabing = false;
                      this.showunget = true;
                    }, 2000);
                  } else if (res.result.msg == "抢到红包") {
                    getRedPacket().then((res) => {
                      console.log("getRedPacket", res);
                      this.money = res.result.money;
                    });
                    setTimeout(() => {
                      this.showgetmoney = true;
                      this.showgrabing = false;
                    }, 2000);
                  } else {
                    this.trustId = res.result.trustId;
                    setTimeout(() => {
                      this.showgrabing = false;
                      this.showget = true;
                    }, 2000);
                  }
                }
                if (res.code == 2088) {
                  _local.set("show1", 1);
                  setTimeout(() => {
                    this.showgrabing = false;
                    this.showunget = false;
                    this.$dialog
                      .confirm({
                        title: "温馨提示",
                        className: "leftpart",
                        confirmButtonText: "分享获积分",
                        confirmButtonColor: "#45b7cb",
                        cancelButtonText: "明日再来",
                        message:
                          "会员专属30次/日抢单次数已使用完毕，且无足够积分兑换，您可以通过分享获得更多赚钱机会",
                        messageAlign: "left",
                      })
                      .then(() => {
                        // this.$router.push({ path: "/buyjoin" });
                        this.onSelect();
                        _local.remove("show1");
                      })
                      .catch(() => {
                        this.showgrabing = false;
                        this.$router.push("/home/me");
                        _local.remove("show1");
                      });
                  }, 2000);
                } else if (res.code == 2076) {
                  this.showgrabing = false;
                  this.$dialog
                    .alert({
                      title: "温馨提示",
                      message: "该地区暂无订单，如有疑问，请咨询客服",
                      confirmButtonColor: "#45b7cb",
                      theme: "round-button",
                      messageAlign: "left",
                    })
                    .then(() => {});
                }else{
                  this.$toast(res.msg)
                }
              });
            }
          } else {
            this.$dialog
              .confirm({
                title: "温馨提示",
                className: "leftpart",
                confirmButtonText: "是",
                confirmButtonColor: "#45b7cb",
                cancelButtonText: "否",
                message: `当前城市并非是您注册所在[${this.agentCity}]，是否立即切换`,
                messageAlign: "left",
              })
              .then(() => {
                this.$router.push("/city");
              })
              .catch(() => {});
          }
        } else if (_local.get("role") == 4 && _local.get("agent").vip != 2) {
          if (
            this.agentCity == _local.get("city") ||
            _local.get("agent").citycode == "999999"
          ) {
            if (_local.get("show1")) {
              this.show1 = false;
            } else {
              this.show1 = true;
            }
            this.timer3 = setInterval(() => {
              this.time3--;
              if (this.time3 == 1) {
                this.show1 = false;
              }
              if (this.time3 == 0) {
                clearInterval(this.timer3);
                this.time3 = 3;
              }
            }, 1000);
            if (this.show1) {
              setTimeout(() => {
                this.showgrabing = true;
                agentGrab({
                  cityCode: _local.get("agent").citycode,
                }).then((res) => {
                  console.log(res);
                  var day = baseUtils.formatDate2(res.result.time);
                  var today = baseUtils.formatDate2(new Date());
                  if (day == today) {
                    _local.set("show1", 1);
                  } else {
                    _local.set("show1", 0);
                  }
                  // if (res.code == 2076) {
                  //   setTimeout(() => {
                  //     this.showgrabing = false;
                  //     this.showunget = true;
                  //   }, 2000);
                  // }
                  // if (res.code == 2078) {
                  //   setTimeout(() => {
                  //     this.showgrabing = false;
                  //     this.showunget = true;
                  //   }, 2000);
                  // }
                  if (res.code == 201) {
                    if (res.result.msg == "抢单失败") {
                      setTimeout(() => {
                        this.showgrabing = false;
                        this.showunget = true;
                      }, 2000);
                    } else if (res.result.msg == "抢到红包") {
                      getRedPacket().then((res) => {
                        console.log("getRedPacket", res);
                        this.money = res.result.money;
                      });
                      setTimeout(() => {
                        this.showgetmoney = true;
                        this.showgrabing = false;
                      }, 2000);
                    } else {
                      this.trustId = res.result.trustId;
                      setTimeout(() => {
                        this.showgrabing = false;
                        this.showget = true;
                      }, 2000);
                    }
                  }
                  if (res.code == 2088) {
                    _local.set("show1", 1);
                    setTimeout(() => {
                      this.showgrabing = false;
                      this.showunget = false;
                      this.$dialog
                        .confirm({
                          title: "温馨提示",
                          className: "leftpart",
                          confirmButtonText: "会员入驻",
                          confirmButtonColor: "#45b7cb",
                          cancelButtonText: "分享获积分",
                          message:
                            "3次/日抢单体验已使用完毕，且无足够积分兑换，您可以通过以下方式继续获得抢单机会",
                          messageAlign: "left",
                        })
                        .then(() => {
                          this.$router.push({ path: "/buyjoin" });
                          _local.remove("show1");
                        })
                        .catch(() => {
                          this.showgrabing = false;
                          this.onSelect();
                          _local.remove("show1");
                        });
                    }, 2000);
                  } else if (res.code == 2076) {
                    this.showgrabing = false;
                    this.$dialog
                      .alert({
                        title: "温馨提示",
                        message: "该地区暂无订单，如有疑问，请咨询客服",
                        confirmButtonColor: "#45b7cb",
                        theme: "round-button",
                        messageAlign: "left",
                      })
                      .then(() => {});
                  }
                });
              }, 3000);
            } else {
              this.showgrabing = true;
              agentGrab({
                cityCode: _local.get("agent").citycode,
              }).then((res) => {
                console.log(res);
                var day = baseUtils.formatDate2(res.result.time);
                var today = baseUtils.formatDate2(new Date());
                if (day == today) {
                  _local.set("show1", 1);
                } else {
                  _local.set("show1", 0);
                }
                // if (res.code == 2076) {
                //   setTimeout(() => {
                //     this.showgrabing = false;
                //     this.showunget = true;
                //   }, 2000);
                // }
                // if (res.code == 2078) {
                //   setTimeout(() => {
                //     this.showgrabing = false;
                //     this.showunget = true;
                //   }, 2000);
                // }
                if (res.code == 201) {
                  if (res.result.msg == "抢单失败") {
                    setTimeout(() => {
                      this.showgrabing = false;
                      this.showunget = true;
                    }, 2000);
                  } else if (res.result.msg == "抢到红包") {
                    getRedPacket().then((res) => {
                      console.log("getRedPacket", res);
                      this.money = res.result.money;
                    });
                    setTimeout(() => {
                      this.showgetmoney = true;
                      this.showgrabing = false;
                    }, 2000);
                  } else {
                    this.trustId = res.result.trustId;
                    setTimeout(() => {
                      this.showgrabing = false;
                      this.showget = true;
                    }, 2000);
                  }
                }
                if (res.code == 2088) {
                  _local.set("show1", 1);
                  setTimeout(() => {
                    this.showgrabing = false;
                    this.showunget = false;
                    this.$dialog
                      .confirm({
                        title: "温馨提示",
                        className: "leftpart",
                        confirmButtonText: "会员入驻",
                        confirmButtonColor: "#45b7cb",
                        cancelButtonText: "分享获积分",
                        message:
                          "3次/日抢单体验已使用完毕，且无足够积分兑换，您可以通过以下方式继续获得抢单机会",
                        messageAlign: "left",
                      })
                      .then(() => {
                        this.$router.push({ path: "/buyjoin" });
                        _local.remove("show1");
                      })
                      .catch(() => {
                        this.showgrabing = false;
                        this.onSelect();
                        _local.remove("show1");
                      });
                  }, 2000);
                } else if (res.code == 2076) {
                  this.showgrabing = false;
                  this.$dialog
                    .alert({
                      title: "温馨提示",
                      message: "该地区暂无订单，如有疑问，请咨询客服",
                      confirmButtonColor: "#45b7cb",
                      theme: "round-button",
                      messageAlign: "left",
                    })
                    .then(() => {});
                }
              });
            }
          } else {
            this.$dialog
              .confirm({
                title: "温馨提示",
                className: "leftpart",
                confirmButtonText: "是",
                confirmButtonColor: "#45b7cb",
                cancelButtonText: "否",
                message: `当前城市并非是您注册所在[${this.agentCity}]，是否立即切换`,
                messageAlign: "left",
              })
              .then(() => {
                this.$router.push("/city");
              })
              .catch(() => {});
          }
        }
      } else {
        this.$router.push({ path: "/login" });
      }
    },
    todetail() {
      if (this.agent.vip == 2) {
        this.$router.push({
          path: "/graborderdetail",
          query: { trustId: this.trustId },
        });
      } else {
        this.$dialog
          .confirm({
            title: "温馨提示",
            className: "leftpart",
            confirmButtonText: "立即购买",
            confirmButtonColor: "#45b7cb",
            cancelButtonText: "取消",
            message:
              "您需要获得会员资格才能成功抢单，取得会员资格参与抢单，前往购买服务？",
            messageAlign: "left",
          })
          .then(() => {
            _this.$router.push({ path: "/buyjoin" });
          })
          .catch(() => {});
      }
    },
    onConfirm(value) {
      this.area = value;
      // this.arealist.forEach((e) => {
      //   if (e.name == value) {
      //     this.sendval.adcode = e.adcode;
      //     return;
      //   }
      // });
      this.showarea = false;
    },
    onCancel() {
      this.showarea = false;
    },
    onclosetime1() {
      this.showtime1 = false;
    },
    choosetime1() {
      this.showtime1 = false;
      this.showtime2 = true;
      this.TimeMin = this.seeApartmentTimeMin.substr(0, 2);
    },
    onclosetime2() {
      this.showtime2 = false;
    },
    choosetime2() {
      this.showtime2 = false;
    },
    getredenvelopes() {
      this.showgetmoney = false;
      this.showred = true;
      this.timer2 = setInterval(() => {
        this.time--;
        if (this.time === 0) {
          this.showred = false;
          this.time = 3;
          this.showreddetail = true;
          clearInterval(this.timer2);
        }
      }, 1000);
    },
    closered() {
      this.showred = false;
    },
    closedetail() {
      this.showreddetail = false;
    },
    tomoney() {
      this.$router.push({ path: "/money" });
    },
  },
};
</script>

<style lang="less" scoped>
.van-overlay {
  z-index: 10000;
}
#normal_map {
  width: 92vw;
  height: 100%;
}
@keyframes change {
  0% {
    width: 0px;
  }
  100% {
    width: 30px;
  }
}
.map {
  position: relative;
  background-color: #f1f1f1;
  height: 250px;
  padding: 0 15px;
  .amap-page-container {
    height: 100%;
    /deep/.amap-demo {
      height: 100%;
      .amap-logo,
      .amap-copyright {
        visibility: hidden !important;
      }
    }
  }
  .shownum {
    position: absolute;
    padding: 4px 10px;
    background-color: #d43b33;
    color: #fff;
    font-size: 12px;
    border-radius: 5px;
    z-index: 1000;
  }
  .showbox9{
    top: 45px;
    right: 25px;
  }
  .showbox1 {
    top: 80px;
    left: 60%;
  }
  .showbox7 {
    top: 90px;
    left: 32%;
  }
  .showbox8 {
    top: 160px;
    left: 22%;
  }
  .showbox2 {
    top: 200px;
    left: 8%;
  }
  .showbox3 {
    top: 130px;
    left: 50%;
  }
  .showbox4 {
    top: 180px;
    left: 70%;
  }
  .showbox5 {
    top: 50px;
    left: 20%;
  }
  .showbox6 {
    top: 20px;
    left: 40%;
  }
}
.showpart {
  padding: 15px;
  background-color: #f2f2f2;
  .card {
    border-radius: 10px;
    padding: 15px;
    background-color: #fff;
    margin-bottom: 10px;
    .box1 {
      color: #333;
      font-weight: bold;
      padding-bottom: 10px;
      border-bottom: 1px solid #ccc;
      span {
        margin-left: 10px;
        font-size: 13px;
        color: #999;
      }
    }
    .box2 {
      display: flex;
      justify-content: space-between;
      padding: 7px 0;
      > div {
        font-size: 13px;
        color: #333;
        font-weight: bold;
        display: flex;
        align-items: center;
      }
      > span {
        font-weight: bold;
        font-size: 13px;
        color: #d43b33;
      }
    }
  }
  .tipwords {
    font-size: 12px;
    color: #999;
    padding: 0 20px 90px;
  }
}
.btnpart {
  position: fixed;
  bottom: 0px;
  left: 0px;
  width: 100%;
  padding: 10px 0;
  border-top: 1px solid #f1f1f1;
  background-color: #fff;
  text-align: center;
  .cheak {
    padding-bottom: 5px;
    height: 20px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 0 15px;
    font-size: 11px;
    color: #333;

    .xy {
      color: #d43b33;
    }
  }
  button:active {
    background-image: linear-gradient(to bottom right, #f16e6777, #d43b3377);
  }
  button {
    border: none;
    border-radius: 20px;
    height: 40px;
    width: 90%;
    color: #fff;
    background-image: linear-gradient(to bottom right, #f16e67, #d43b33);
  }
  .safe {
    padding-bottom: constant(safe-area-inset-bottom);
    padding-bottom: env(safe-area-inset-bottom);
  }
}
.wrapper {
  z-index: 10000;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  .anmition {
    display: inline-block;
    overflow: hidden;
    animation-name: change;
    animation-duration: 1.5s;
    animation-iteration-count: infinite;
  }
  .spart {
    border-radius: 10px;
    width: 300px;
    height: 190px;
    background-color: #fff;
    box-sizing: border-box;
    padding: 10px;
    .close {
      text-align: right;
    }
    .words {
      width: 210px;
      min-width: 210px;
      display: flex;
      justify-content: flex-start;
      align-items: center;
      flex-wrap: nowrap;
      white-space: nowrap;
      margin: 40px auto 0;
      font-size: 20px;
      color: #333;
      font-weight: bold;
    }
    .words4 {
      text-align: center;
      margin: 30px auto 0;
      font-size: 20px;
      color: #333;
      font-weight: bold;
    }
    .words2 {
      text-align: center;
      width: 230px;
      margin: 30px auto 0;
      font-size: 15px;
      color: #333;
      font-weight: bold;
    }
    .words3 {
      margin-top: 10px;
    }
    .bpart {
      margin-top: 30px;
      color: #fff;
      text-align: center;
      button {
        font-size: 14px;
        border-radius: 15px;
        border: none;
        padding: 8px 15px;
        background-color: #d43b33;
      }
    }
  }
  .red {
    display: flex;
    flex-direction: column;
    align-items: center;
    > img {
      width: 300px;
      transform: translateY(-20px);
    }
    .word {
      color: #ffe5aa;
      margin-top: -40px;
      font-size: 15px;
    }
    .closebtn {
      color: #fff;
      margin-top: 20px;
    }
  }
  .reddetail {
    width: 375px;
    height: 575px;
    background: url("../../assets/redbg01.png") no-repeat 0px 0px;
    background-size: 100% 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    .box1 {
      width: 235px;
      height: 290px;
      background: url("../../assets/redbg02.png") no-repeat 0px 0px;
      background-size: 100% 100%;
      text-align: center;
      .word1 {
        margin-top: 30px;
        font-size: 28px;
        font-weight: bold;
        color: #fff7c6;
      }
      .word2 {
        margin-top: 10px;
        font-size: 28px;
        color: #fff7c6;
        span {
          font-weight: bold;
          font-size: 90px;
        }
      }
      .word3 {
        margin-top: 10px;
        margin-bottom: 20px;
        > button {
          width: 150px;
          height: 38px;
          background-color: #eef407;
          border: none;
          font-size: 21px;
          font-weight: bold;
          border-radius: 20px;
          color: #ed3e26;
        }
      }
      .word4 {
        text-align: left;
        font-size: 12px;
        transform: scale(calc(11 / 12));
        color: #ffe5aa;
        span {
          color: #ffd176;
        }
      }
    }
    .closebtn {
      padding-top: 40px;
      color: #fff;
    }
  }
}
</style>
